﻿<div id="main" role="main" ng-controller="DashboardCtrl" class="workflow-page" sizeelement>
    <div class="pre-loading" style="display: block;">
        <indicator-shown class="fa-2x" style="color: #2C3742"></indicator-shown>
        <span class="preloadertext">Loading...</span>
    </div>

    <div id="content" class="fadeWhenChange" style="display: none;">
        <div class="row">
            <div class="col-xs-12">
                <h1 class="page-title txt-color-blueDark"><i class="fa-fw fa fa-table"></i>{{dashboard.workflow.onViewDetail?'Workflow Detail':'Dashboard'}}</h1>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-12" ng-show="!dashboard.workflow.onViewDetail">
                <form class="smart-form" name="workflowlistform" novalidate>
                    <header>Search workflows</header>
                    <fieldset>
                        <div class="row">
                            <section class="col col-xs-12 col-md-4">
                                <label class="label">Workflow Id</label>
                                <label class="input">
                                    <input type="text" name="woidfilter" ng-model="dashboard.workflow.filter.woid" placeholder="Type workflow id...">
                                </label>
                            </section>
                            <section class="col col-xs-12 col-md-4">
                                <label class="label">Workflow Code</label>
                                <label class="select">
                                    <select ng-model="dashboard.workflow.filter.wcode" ng-options="wocode for wocode in dashboard.workflow.search.workflowCodes"></select>
                                    <i></i>
                                </label>
                            </section>
                            <section class="col col-xs-12 col-md-4">
                                <label class="label">Active</label>
                                <label class="checkbox">
                                    <input type="checkbox" name="activefilter" ng-model="dashboard.workflow.filter.isActive"><i></i>
                                </label>
                            </section>
                        </div>
                        <div class="row">
                            <section class="col col-xs-12 col-md-4">
                                <label class="label">Started from</label>
                                <label class="input">
                                    <i class="icon-append fa fa-calendar"></i>
                                    <input type="text" id="startdatepicker" placeholder="Started from" ng-model="dashboard.workflow.filter.start" name="startfilter" format="{{dashboard.workflow.formatDate}}" limitid="tilldatepicker" limit-type="mindate" datepicker>
                                </label>
                            </section>
                            <section class="col col-xs-12 col-md-4">
                                <label class="label">Till</label>
                                <label class="input">
                                    <i class="icon-append fa fa-calendar"></i>
                                    <input type="text" id="tilldatepicker" placeholder="Till" ng-model="dashboard.workflow.filter.end" limitid="startdatepicker" limit-type="maxdate" name="endfilter" format="{{dashboard.workflow.formatDate}}" datepicker>
                                </label>
                            </section>
                            <section class="col col-xs-12 col-md-4">
                                <label class="label">Show</label>
                                <label class="select">
                                    <select ng-model="dashboard.workflow.filter.pageSize" ng-options="ps for ps in dashboard.workflow.search.pageSizes"></select>
                                    <i></i>
                                </label>
                            </section>
                        </div>
                    </fieldset>
                </form>
                <div class="jarviswidget jarviswidget-color-blueDark" style="margin-bottom: 0">
                    <header>
                        <div style="float: right; height: 32px;">
                            <indicator class="fa-2x" style="color: #fff; margin: 0 10px 0 0;" show="dashboard.workflow.onLoading || dashboard.workflow.onAction"></indicator>
                        </div>
                        <span class="widget-icon"><i class="fa fa-table"></i></span>
                        <h2>Workflow(s) </h2>
                    </header>
                </div>
                <div>
                    <div class="widget-body workflowtable-wrapper">
                        <div class="overlay" ng-show="dashboard.workflow.onLoading || dashboard.workflow.onAction"></div>
                        <div class="wf-refresh">
                                <button class="btn btn-xs btn-primary" ng-disabled="dashboard.workflow.onAction" ng-click="refreshWorkflowsList('Restart')"><i class="fa fa-refresh"></i>&nbsp;Refresh</button>
                            </div>
                        <div class="workflow-control">
                            <ul class="demo-btns wf-buttons">
                                <li>
                                    <button class="btn btn-xs btn-default" ng-disabled="dashboard.workflow.onAction" ng-click="doAction('Restart')"><i class="fa fa-refresh"></i>&nbsp;Restart</button>
                                </li>
                                <li>
                                    <button class="btn btn-xs btn-warning" ng-disabled="dashboard.workflow.onAction" ng-click="doAction('Terminate')"><i class="fa fa-stop"></i>&nbsp;Terminate</button>
                                </li>
                                <li>
                                    <button class="btn btn-xs btn-danger" ng-disabled="dashboard.workflow.onAction" ng-click="doAction('Delete')"><i class="fa fa-times"></i>&nbsp;Delete</button>
                                </li>
                            </ul>
                        </div>
                        <div class="clearfix"></div>
                        <div class="alert alert-success no-margin" ng-show="dashboard.workflow.showMessage && !dashboard.workflow.hasErrors && !dashboard.workflow.hasWarning">
                            <i class="fa-fw fa fa-check"></i>{{dashboard.workflow.message}}
                       
                        </div>
                        <div class="alert alert-danger no-margin" ng-show="dashboard.workflow.showMessage && dashboard.workflow.hasErrors && !dashboard.workflow.hasWarning">
                            <div ng-bind-html="dashboard.workflow.message"></div>
                        </div>
                        <div class="alert alert-warning no-margin" ng-show="dashboard.workflow.showMessage && dashboard.workflow.hasWarning">
                            <i class="fa-fw fa fa-warning"></i>{{dashboard.workflow.message}}
                        </div>
                        <div class="table-responsive">
                            <table id="datatable_fixed_column" class="table table-striped table-bordered smart-form workflowtable">
                                <thead>
                                    <tr>
                                        <th style="width: 33px;">Select</th>
                                        <th>Code</th>
                                        <th>Status</th>
                                        <th>Workflow Id</th>
                                        <th>Started On</th>
                                        <th>Completed On</th>
                                    </tr>
                                </thead>
                                <tbody ng-switch="isExpanded(fl)" ng-class-odd="odd" ng-class-even="even" ng-repeat="fl in dashboard.workflow.data | filter:dashboard.workflow.dataFilter">
                                    <tr class="parent-tr workflow-tr" ng-class="{'expanded-child':isExpanded(fl),'selected-wf':isSelected(fl)}">
                                        <td class="tbcheckbox">
                                            <label class="checkbox">
                                                <input type="checkbox" name="checkbox-inline" ng-checked="isSelected(fl)" ng-click="selectWorkflow(fl,$event)"><i></i>
                                            </label>
                                        </td>
                                        <td ng-click="viewWorkflowDetail(fl,$event)">
                                            <div class="workflow-code">
                                                <span ng-if="isHaveChild(fl)" class="expand-button" ng-click="expandChild(fl)"><i class="fa fa-plus expand-collapse-button" ng-if="!isExpanded(fl)"></i><i class="fa fa-minus expand-collapse-button" ng-if="isExpanded(fl)"></i></span>{{fl.code}}
                                            </div>
                                        </td>
                                        <td ng-click="viewWorkflowDetail(fl,$event)">{{fl.status}}</td>
                                        <td ng-click="viewWorkflowDetail(fl,$event)">{{fl.wfid}}</td>
                                        <td ng-click="viewWorkflowDetail(fl,$event)">{{fl.start}}</td>
                                        <td ng-click="viewWorkflowDetail(fl,$event)">{{fl.end}}</td>
                                    </tr>
                                    <tr ng-switch-when="true">
                                        <td colspan="6">
                                            <div class="table-responsive child-table">
                                                <table class="table table-striped table-bordered smart-form workflowtable">
                                                    <thead>
                                                        <tr>
                                                            <th style="width: 33px;">Select</th>
                                                            <th>Code</th>
                                                            <th>Status</th>
                                                            <th>Workflow Id</th>
                                                            <th>Started On</th>
                                                            <th>Completed On</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody ng-class-odd="odd" ng-class-even="even" ng-repeat="flc in getWorkflowChild(fl.wfid)">
                                                        <tr class="workflow-tr" ng-class="{'selected-wf':isSelected(flc)}">
                                                            <td class="tbcheckbox">
                                                                <label class="checkbox">
                                                                    <input type="checkbox" name="checkbox-inline" ng-checked="isSelected(flc)" ng-click="selectWorkflow(flc,$event)"><i></i>
                                                                </label>
                                                            </td>
                                                            <td ng-click="viewWorkflowDetail(flc)">{{flc.code}}</td>
                                                            <td ng-click="viewWorkflowDetail(flc)">{{flc.status}}</td>
                                                            <td ng-click="viewWorkflowDetail(flc)">{{flc.wfid}}</td>
                                                            <td ng-click="viewWorkflowDetail(flc)">{{flc.start}}</td>
                                                            <td ng-click="viewWorkflowDetail(flc)">{{flc.end}}</td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </div>

                                        </td>
                                    </tr>
                                </tbody>

                                <!--<tr ng-class-odd="odd" ng-class-even="even" ng-repeat="fl in $data" class="workflow-tr">
                                        <td width="30" style="text-align: center" data-title="'Select'" class="tbcheckbox">
                                            <label class="checkbox">
                                                <input type="checkbox" name="checkbox-inline" ng-checked="isSelected(fl)" ng-click="selectWorkflow(fl,$event)"><i></i></label>
                                        </td>
                                        <td data-title="'Code'" ng-click="viewWorkflowDetail(fl)">{{fl.code}}</td>
                                        <td data-title="'Status'" ng-click="viewWorkflowDetail(fl)">{{fl.status}}</td>
                                        <td data-title="'Workflow Id'" ng-click="viewWorkflowDetail(fl)">{{fl.wfid}}</td>
                                        <td data-title="'Started On'" ng-click="viewWorkflowDetail(fl)">{{fl.start}}</td>
                                        <td data-title="'Completed On'" ng-click="viewWorkflowDetail(fl)">{{fl.end}}</td>
                                    </tr>-->
                                <tbody ng-show="!dashboard.workflow.data.length">
                                    <tr class="workflow-nodata">
                                        <td colspan="6">No workflows was found</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                        <div class="row" style="margin-top: 10px;">
                            <div class="col-sm-12 text-right">
                                <div class="dataTables_paginate paging_bootstrap_full">
                                    <paginate paginate-pages='{{dashboard.workflow.total}}' current-page='dashboard.workflow.pageIndex' control="dashboard.workflow.pageControl"></paginate>
                                </div>
                            </div>
                        </div>
                        <!--<div class="alert alert-success no-margin" ng-show="dashboard.workflow.showMessage && !dashboard.workflow.hasErrors">
                            <i class="fa-fw fa fa-check"></i> {{dashboard.workflow.message}}
                        </div>
                        <div class="alert alert-danger no-margin" ng-show="dashboard.workflow.showMessage && dashboard.workflow.hasErrors">
							<div ng-bind-html="dashboard.workflow.message"></div>
						</div>-->
                        <div class="workflow-control">
                            <div class="wf-refresh">
                                <button class="btn btn-xs btn-primary" ng-disabled="dashboard.workflow.onAction" ng-click="refreshWorkflowsList('Restart')"><i class="fa fa-refresh"></i>&nbsp;Refresh</button>
                            </div>
                            <ul class="demo-btns wf-buttons">
                                <li>
                                    <button class="btn btn-xs btn-default" ng-disabled="dashboard.workflow.onAction" ng-click="doAction('Restart')"><i class="fa fa-refresh"></i>&nbsp;Restart</button>
                                </li>
                                <li>
                                    <button class="btn btn-xs btn-warning" ng-disabled="dashboard.workflow.onAction" ng-click="doAction('Terminate')"><i class="fa fa-stop"></i>&nbsp;Terminate</button>
                                </li>
                                <li>
                                    <button class="btn btn-xs btn-danger" ng-disabled="dashboard.workflow.onAction" ng-click="doAction('Delete')"><i class="fa fa-times"></i>&nbsp;Delete</button>
                                </li>
                            </ul>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>
            <div class="col-xs-12" ng-show="dashboard.workflow.onViewDetail">
                <button class="btn btn-default" ng-click="workflowBackTolist()"><i class="fa fa-chevron-left"></i>&nbsp;Back to list</button>
                <form name="workflowdetailform" novalidate>
                    <fieldset>
                        <legend>Tasks</legend>
                        <div class="form-group">
                            <label><strong>Workflow Id</strong>: {{dashboard.workflow.detail.wfid}}</label>
                        </div>
                        <div class="form-group table-responsive">
                            <table class="table table-bordered">
                                <thead>
                                    <tr>
                                        <th>Task id</th>
                                        <th>Code</th>
                                        <th style="min-width: 90px;">Assigned to</th>
                                        <th>Title</th>
                                        <th style="min-width: 90px;">Expire date</th>
                                        <th>Description</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr ng-repeat="t in dashboard.workflow.detail.tasks.tasks">
                                        <td>{{t.taskId}}</td>
                                        <td>{{t.code}}</td>
                                        <td>{{t.acceptedBy}}</td>
                                        <td>{{t.title}}</td>
                                        <td>{{t.expiryDate}}</td>
                                        <td>
                                            <p ng-bind-html="t.description"></p>
                                        </td>
                                    </tr>
                                    <tr class="workflow-detail-notasks" ng-show="!dashboard.workflow.detail.tasks.tasks.length">
                                        <td colspan="6">No tasks was found</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </fieldset>
                    <fieldset>
                        <legend>Traces</legend>
                        <div class="form-group table-responsive">
                            <table class="table table-bordered">
                                <thead>
                                    <tr>
                                        <th>User</th>
                                        <th>Action</th>
                                        <th>Message</th>
                                        <th>When</th>
                                        <th>Result</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr ng-repeat="t in dashboard.workflow.detail.traces.traces">
                                        <td>{{t.user}}</td>
                                        <td>{{t.action}}</td>
                                        <td>{{t.message}}</td>
                                        <td>{{t.when}}</td>
                                        <td>{{t.result}}</td>
                                    </tr>
                                    <tr class="workflow-detail-notraces" ng-show="!dashboard.workflow.detail.traces.traces.length">
                                        <td colspan="5">No traces was found</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </fieldset>
                    <fieldset>
                        <legend>Properties</legend>
                        <div class="form-group table-responsive">
                            <table class="table table-bordered">
                                <thead>
                                    <tr>
                                        <th>Name</th>
                                        <th>Value</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr ng-repeat="p in dashboard.workflow.detail.properties.properties">
                                        <td>{{p.name}}</td>
                                        <td>
                                            <p ng-show="!isDocumentType(p)">{{p.value}}</p>
                                            <p ng-show="isDocumentType(p)"><download-file-dashboard property="p"></download-file-dashboard></p>
                                        </td>
                                    </tr>
                                    <tr class="workflow-detail-notproperties" ng-show="!dashboard.workflow.detail.properties.properties.length">
                                        <td colspan="5">No properties found</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </fieldset>
                </form>
            </div>
        </div>

    </div>
</div>
